<template>
  <div class="hotAndNewView-container">
    <div class="nav-bar">
      <van-nav-bar
        :title="title"
        left-text="返回"
        left-arrow
        class="category-nav-bar"
        @click-left="back"
      />
    </div>

    <div class="banner">
      <img :src="src"  />
    </div>

    <div class="nav">
      <NavBar ref='navbar'></NavBar>
    </div>

    <GoodsList ></GoodsList>
  </div>
</template>

<script>
import GoodsList from "../components/GoodsList";
import NavBar from "../components/NavBar";



export default {
  components: { GoodsList, NavBar },
  data() {
    return {
      goodlist: [],
      title: "",
      src: "",
    };
  },
  methods: {
    // async getdata() {
    //   let id = this.$route.query.id;
    //   this.title = id == 0 ? "新品首发" : "人气推荐";
    //   this.src = id == 0 ? require('../images/newstart.png') :require('../images/command.png') ;
    //   let res = await goodsList({
    //     isHot: id == 0 ? "" : "1",
    //     isNew: id == 0 ? "1" : "",
    //     order: '',
    //   });
    //   this.goodlist = res;
    // },
    back() {
      this.$router.back();
    },
  },
  mounted() {
    let id = this.$route.query.id;
    this.title = id == 0 ? "新品首发" : "人气推荐";
    this.src = id == 0 ? require('../images/newstart.png') :require('../images/command.png') ;
    this.$refs.navbar.getdata()
  },
};
</script>

<style scoped lang='scss'>
.banner {
  height: 326px;
  background-color: red;
  img{
    width: 100%;
    height: 100%;
  }
}
.nav {
  height: 100px;
  padding-top: 40px;
}
.search-nav {
  width: 100%;
  height: 40px;
  display: flex;
  justify-content: space-around;
  font-size: 28px;
  color: #212121;
  letter-spacing: 0;
  font-weight: 400;
  .price {
    display: flex;
    height: 100%;
    .price-icon {
      height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: space-around;
      padding-bottom: 17px;
      .icon-price {
        width: 13.3px;
        height: 6.6px;
      }
    }
  }
  .active {
    color: #cea62a;
  }
}
</style>